<!-- ========================================= BANNER ============================================== -->
    <section id="banner">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12 -col-sm-12 col-xs-12">
                    <div class="box-breadcrumbs">
                        <h2>DANH SÁCH <i>BÀI VIẾT</i></h2>
                        <ol class="breadcrumb">
                            <li>Bạn đang ở :</li>
                            <li><a href="#">Trang chủ</a></li>
                            <li class="active">Bài viết</li>
                        </ol>
                    </div><!--end breadcrumbs-->
                </div><!--end col-->
            </div><!--end row-->
        </div><!--end container-->
    </section><!--end banner-->
    <!-- ========================================= END BANNER ========================================== -->


    <div class="margin-tb"></div>


    <!-- ========================================= LIST ARTICLE ======================================== -->
    <section id="list-article">
        <div class="container">
            <div class="row">

                <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
                    <div class="box-row-article">
                        <div class=" bg-1 box-img">
                            <img src="<?php echo Yii::app()->request->baseUrl; ?>/frontend/images/article/article_img01.jpg" alt="article_img01" class="img-responsive">
                            <a href="detail-article.html">
                                <div class="box-img-article-hover text-center text-1">
                                    <i class="fa fa-link fa-3x"></i>
                                </div>
                            </a>
                        </div>
                        <div class="tag-date">
                            <div class="square">
                                <h4 class="text-6 text-center">15 T.10 2014</h4>
                            </div>
                        </div>
                        <h4 class="text-1">
                            <a href="detail-article.html" class="text-1">
                                Chia sẻ mạng xã hội trong Joomla với BT Social Share
                            </a>
                        </h4>
                        <div class="box-row-info">
                            <ul class="full-width no-margin no-padding">
                                <li><i class="fa fa-user icons"></i>&nbsp;ĐĂNG BỞI: TIENPD</li>
                                <li><i class="fa fa-folder-open icons"></i>&nbsp; CHỦ ĐỀ: TIÊU ĐỀ CHỦ ĐỀ</li>
                                <li><i class="fa fa-comments icons"></i>&nbsp;BÌNH LUẬN: 6</li>
                            </ul>
                        </div>
                        <div class="box-row-content text-left full-width">
                            <p>Hầu hết các website hay blog hiện nay đều tích hợp tính năng chia sẻ mạng xã hội như Facebook, Twitter và Google Plus. Nếu các bạn đang sở hữu một trang web được làm bằng Joomla thì BT Social Share sẽ là lựa chọn tốt nhất cho các bạn tin dùng để tích hợp mạng xã hội vào trang web của mình,... </p>
                        </div>
                    </div>

                    <div class="box-row-article">
                        <div class=" bg-1 box-img">
                            <img src="<?php echo Yii::app()->request->baseUrl; ?>/frontend/images/article/article_img02.jpg" alt="article_img02" class="img-responsive">
                            <a href="detail-article.html">
                                <div class="box-img-article-hover text-center text-1">
                                    <i class="fa fa-link fa-3x"></i>
                                </div>
                            </a>
                        </div>
                        <div class="tag-date">
                            <div class="square">
                                <h4 class="text-6 text-center">17 T.10 2014</h4>
                            </div>
                        </div>
                        <h4 class="text-1">
                            <a href="detail-article.html" class="text-1">
                                Vô hiệu hóa Disqus trên Custom Post Types trong WordPress
                            </a>
                        </h4>
                        <div class="box-row-info">
                            <ul class="full-width no-margin no-padding">
                                <li><i class="fa fa-user icons"></i>&nbsp;ĐĂNG BỞI: HUYPHAM</li>
                                <li><i class="fa fa-folder-open icons"></i>&nbsp; CHỦ ĐỀ: TIÊU ĐỀ CHỦ ĐỀ</li>
                                <li><i class="fa fa-comments icons"></i>&nbsp;BÌNH LUẬN: 6</li>
                            </ul>
                        </div>
                        <div class="box-row-content text-left full-width">
                            <p>Nếu các bạn đang sử dụng Disqus comment system cho việc hiển thị bình luận trên website hay blog của mình thì ắt hẳn là đã quen thuộc với chức năng mà nó cung cấp. Nếu các bạn muốn vô hiệu hóa (Disable) nó trên những custom post types có trên trang web hay blog , thì bài viết này sẽ giúp các bạn làm điều đó,... </p>
                        </div>
                    </div>

                    <div class="box-row-article">
                        <div class=" bg-1 box-img">
                            <img src="<?php echo Yii::app()->request->baseUrl; ?>/frontend/images/article/article_img01.jpg" alt="article_img03" class="img-responsive">
                            <a href="detail-article.html">
                                <div class="box-img-article-hover text-center text-1">
                                    <i class="fa fa-link fa-3x"></i>
                                </div>
                            </a>
                        </div>
                        <div class="tag-date">
                            <div class="square">
                                <h4 class="text-6 text-center">20 T.10 2014</h4>
                            </div>
                        </div>
                        <h4 class="text-1">
                            <a href="detail-article.html" class="text-1">
                                Giới hạn kí tự nhập trong Textarea bằng Javascript
                            </a>
                        </h4>
                        <div class="box-row-info">
                            <ul class="full-width no-margin no-padding">
                                <li><i class="fa fa-user icons"></i>&nbsp;ĐĂNG BỞI: GIANGTRANG</li>
                                <li><i class="fa fa-folder-open icons"></i>&nbsp; CHỦ ĐỀ: TIÊU ĐỀ CHỦ ĐỀ</li>
                                <li><i class="fa fa-comments icons"></i>&nbsp;BÌNH LUẬN: 6</li>
                            </ul>
                        </div>
                        <div class="box-row-content text-left full-width">
                            <p>Thỉnh thoảng chúng ta sẽ bắt gặp một số website hay blog có một form cho người dùng nhập liệu.Và khi chúng ta nhập vào các ô textarea thì thường có kèm theo chức năng đếm số kí tự cho phép còn lại, và khi chúng ta vượt quá số lượng đó thì không thể nhập thêm vào nữa. Trong bài viết này, mình sẽ chỉ cho các bạn cách để làm điều đó , rất đơn giản với Javascript,... </p>
                        </div>
                    </div>

                    <div class="box-row-article">
                        <div class=" bg-1 box-img">
                            <img src="<?php echo Yii::app()->request->baseUrl; ?>/frontend/images/article/article_img01.jpg" alt="article_img04" class="img-responsive">
                            <a href="detail-article.html">
                                <div class="box-img-article-hover text-center text-1">
                                    <i class="fa fa-link fa-3x"></i>
                                </div>
                            </a>
                        </div>
                        <div class="tag-date">
                            <div class="square">
                                <h4 class="text-6 text-center">25 T.10 2014</h4>
                            </div>
                        </div>
                        <h4 class="text-1">
                            <a href="detail-article.html" class="text-1">
                                Tạo chức năng Ajax cho website bằng JQuery
                            </a>
                        </h4>
                        <div class="box-row-info">
                            <ul class="full-width no-margin no-padding">
                                <li><i class="fa fa-user icons"></i>&nbsp;ĐĂNG BỞI: HUYNGUYEN</li>
                                <li><i class="fa fa-folder-open icons"></i>&nbsp; CHỦ ĐỀ: TIÊU ĐỀ CHỦ ĐỀ</li>
                                <li><i class="fa fa-comments icons"></i>&nbsp;BÌNH LUẬN: 6</li>
                            </ul>
                        </div>
                        <div class="box-row-content text-left full-width">
                            <p>Ajax là một trong những kỹ thuật mà mọi lập trình viên hay những người phát triển web đều cần phải học và sử dụng thành thạo. Hôm nay mình sẽ chia sẻ cho các bạn các bước thực hiện để tạo một chức năng ajax đơn giản cho web. Và qua bài viết này, các bạn sẽ hiểu rõ hơn về ajax cũng như cách sử dụng nó cho những mục đích của mình,... </p>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <div class="list-pages text-center">
                                <ul class="full-width no-margin no-padding">
                                    <li><a href="#"><i class="fa fa-angle-double-left"></i></a></li>
                                    <li><a href="#">1</a></li>
                                    <li><a href="#" class="active">2</a></li>
                                    <li><a href="#">...</a></li>
                                    <li><a href="#">6</a></li>
                                    <li><a href="#"><i class="fa fa-angle-double-right"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
                    <!-- echo box-right -->
                    <?php $this->widget('application.components.BoxRight'); ?>
                </div>

            </div>
        </div>
    </section>
    <!-- ========================================= END LIST ARTICLE ==================================== -->
   